<template>
  <div class="activity-detail">
    <h1>{{ activity.title }}</h1>
    <p>日期: {{ activity.date }}</p>
    <p>地点: {{ activity.location }}</p>
    <p>描述: {{ activity.description }}</p>
    <router-link to="/public-activities">返回列表</router-link>
  </div>
</template>

<script>
import activities from '@/assets/hw10_activities.json';

export default {
  name: 'ActivityDetail',
  data() {
    return {
      activity: {}
    }
  },
  created() {
    const activityId = parseInt(this.$route.params.id);
    this.activity = activities.find(a => a.id === activityId) || {};
  }
}
</script>

<style scoped>
.activity-detail {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}
</style>